<ui:composition template="/WEB-INF/template/layoutPadrao.xhtml"
	xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">

	<ui:define name="titulo">Pesquisa Material</ui:define>

	<ui:define name="corpo">
		<h:form>

			<h1>Pesquisa Material</h1>

			<p:toolbar style="margin-top:20px">
				<p:toolbarGroup>
					<p:commandButton value="Pesquisa" action="#{pesquisaMaterialBean.pesquisar}" update="@form"/>
				</p:toolbarGroup>

				<p:toolbarGroup align="right">
					<p:button value="Novo" outcome="/material/cadastroMaterial" />
				</p:toolbarGroup>
			</p:toolbar>

			<p:panelGrid columns="2" id="painel"
				style="width:100%; margin-top:20px" columnClasses="rotulo, campo">
				
				<p:outputLabel value="Especificação" for="nome" />
				<p:inputText id="nome" size="60" value="#{pesquisaMaterialBean.filtro.nome}" />
				
				<p:outputLabel value="Tombamento Cefet" for="cefet" />
				<p:inputMask  mask="999999" value="#{pesquisaMaterialBean.filtro.tombamentoCefet}" id="cefet"/>
				
				<p:outputLabel value="Tombamento Ifrr"   />				
				<h:panelGroup>
				<p:inputMask  mask="999999"
					value="#{pesquisaMaterialBean.filtro.detombamentoIfrr}" />
				a
				<p:inputMask mask="999999"
					value="#{pesquisaMaterialBean.filtro.atetombamentoIfrr}" />				
				</h:panelGroup>
				<p:outputLabel value="Setor" for="setor" />
				<p:inputText id="setor" size="60" value="#{pesquisaMaterialBean.filtro.nomeSetor}"/>
				
			</p:panelGrid>

			<p:dataTable id="materialTable" 
				value="#{pesquisaMaterialBean.materialFiltrados}" var="material"
				style="margin-top: 20px" emptyMessage="Nenhum material encontrado."
				rows="30" paginator="true" paginatorAlwaysVisible="false"
				paginatorPosition="bottom" >
				
				<p:column headerText="Tomb Cefet" style="width:10px" >
					<h:outputText value="#{material.tombCefet}" />
				</p:column>	
				
				<p:column headerText="Tomb Ifrr" style="width:10px">
					<h:outputText value="#{material.tombIfrr}" />
				</p:column>	
				
				<p:column headerText="Especificação" style="max-width: 450px; min-width: 450px; overflow: hidden">
					<h:outputText value="#{material.especificacao}" />
				</p:column>
				
				<p:column headerText="Estado" style="width: 2px">
					<h:outputText value="#{material.estado}" />
				</p:column>			
								
				<p:column headerText="Valor" style="width: 50px">
					<h:outputText value="#{material.valorBem}" >
						<f:convertNumber type="currency"/>
					</h:outputText>						
				</p:column>						
					
				<p:column headerText="Data da Compra" style="width: 20px">
					<h:outputText value="#{material.dataCompra}" >
						<f:convertDateTime pattern="dd/MM/yyyy"/>
					</h:outputText>
				</p:column>	
				
				<p:column headerText="Empenho" style="width: 100px">
					<h:outputText value="#{material.empenho.empenhoNumero}" />
				</p:column>
						
				<p:column headerText="Empresa" style="width: 100px">
					<h:outputText value="#{material.empresa.nome}" />
				</p:column>
				
				<p:column headerText="Setor" style="width: 80px">
					<h:outputText value="#{material.gestor.setor}" />
				</p:column>
				
				<p:column style="width: 60px; text-align: center">
					<p:button icon="ui-icon-pencil" title="Editar" outcome="/material/cadastroMaterial" >
						<f:param  name="material" value="#{material.id}"/>
					</p:button>							
				</p:column>					
				
			</p:dataTable>
			
		</h:form>
	</ui:define>
</ui:composition>